<template>
  <view class="store-container bg-white" v-if="!loading">
    <view class="logo ww100 p-30-0 d-c-c">
      <image :src="storeDetail.logoImagePath" mode="aspectFill"></image>
    </view>
    <view class="d-c-c d-c ww100">
      <text class="f40">{{ storeDetail.store_name }}</text>
      <text class="f28 gray9">{{ $t('store.business_hours') }}:{{ storeDetail.shopHours }}</text>
    </view>

    <view class="f30 mt30">
      <view class="d-b-c p30 border-b" @click="callPhone(storeDetail.phone)">
        <text class="gray9">{{ $t('store.contact_number') }}</text>
        <view class="">
          <text class="iconfont icon-002dianhua"></text>
          <text>{{ storeDetail.phone }}</text>
        </view>
      </view>
      <view class="d-b-c p30 border-b">
        <text class="gray9">{{ $t('store.contact_person') }}</text>
        <text>{{ storeDetail.linkman }}</text>
      </view>
      <view class="d-b-c p30 border-b">
        <text class="gray9">{{ $t('store.status') }}</text>
        <text class="green">{{ storeDetail.statusText }}</text>
      </view>
      <view class="d-b-c p30 border-b">
        <text class="gray9">{{ $t('store.support_pickup_verification') }}</text>
        <text class="green">{{ storeDetail.isCheckText }}</text>
      </view>
      <view class="d-b-c p30 border-b">
        <text class="gray9">{{ $t('store.province_city_area') }}</text>
        <text>{{ storeDetail.province }}{{ storeDetail.city }}{{ storeDetail.region }}</text>
      </view>
      <view class="d-b-c p30 border-b">
        <text class="gray9">{{ $t('store.address') }}</text>
        <text>{{ storeDetail.address }}</text>
      </view>
      <view class="d-b-c p30 border-b">
        <text class="gray9">{{ $t('store.introduction') }}</text>
        <text class="flex-1 o-h tr">{{ storeDetail.summary }}</text>
      </view>
    </view>
    <view class="store-map">
      <map :latitude="storeDetail.latitude" :longitude="storeDetail.longitude" :markers="covers">
      </map>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      /*是否正在加载*/
      loading: true,
      /*门店ID*/
      store_id: null,
      /*门店详情*/
      storeDetail: {},
      /*标记点*/
      covers: []
    }
  },
  onShow() {
    uni.setNavigationBarTitle({
      title: this.$t('shop.store_details')
    })
  },
  onLoad(e) {

    this.store_id = e.storeId;
  },
  mounted() {
    /*获取订单详情*/
    this.getData();
  },
  methods: {

    /*获取数据*/
    getData() {
      let self = this;
      uni.showLoading({
        title: this.$t('store.loading')
      });
      self._get(
        'store/store/toEdit', {
        storeId: self.store_id,
      },
        function (res) {
          self.storeDetail = res.data;
          let obj = {
            latitude: res.data.latitude,
            longitude: res.data.longitude
          }
          self.covers.push(obj);
          self.loading = false;
          uni.hideLoading();
        }
      );
    },

    /*拨打电话*/
    callPhone(phone) {
      let self = this;
      uni.makePhoneCall({
        phoneNumber: phone
      });
    }
  }
}
</script>

<style lang="scss">
.store-container .logo image {
  width: 200rpx;
  height: 200rpx;
}

.store-container .store-map {
  width: 750rpx;
  height: 400rpx;
}

.store-container .store-map map {
  width: 100%;
  height: 100%;
}

.store-container .icon-002dianhua {
  font-size: 34rpx;
  font-weight: bold;
  color: $dominant-color;
}
</style>
